<template>
	<view class="warp">
		 <view class="list">
		 	<view class="item" v-for="(item,index) in projectlist" :key="index">
		 		<view @click="towebinfo(item)" class="or_cont">
		 			<view class="image_avtor">
		 				<image style="width: 200rpx;height: 200rpx;border-radius: 50%;" :src="item.websiteSellerImage" mode="scaleToFill"></image>
		 			</view>
		 			<view class="indsuce">
		 			<view class="name">
		 				<span style="color: #cecece;margin-right: 20rpx;">姓名：</span>
		 				<span>{{item.websiteSellerTitle}}</span>
		 			</view>
		 			<view class="duty">
		 				<span  style="color: #cecece;margin-right: 20rpx;">职务</span>
		 				<span>{{item.websiteSellerState}}</span>
		 			</view>
		 			<view class="phone">
		 			<span  style="color: #cecece;margin-right: 20rpx;">电话：</span>
		 			<span @click="clallphone(index)" style="color: #ff841f;">{{item.websiteSellerImageType}}</span>
		 			</view>
		 			</view>
		 		</view>
		 	</view>
		 </view>
		<!-- <uni-collapse accordion>
		 	<uni-collapse-item :title="item.websiteSellerState " v-for="(item,index) in projectlist" :key="index">
		 	
		 		
		 	</uni-collapse-item>
		 	 
		 	 
		 </uni-collapse> -->
	</view>
</template>

<script>
	import { mapState, mapMutations } from 'vuex'
	import uniCollapse  from "../../extra/uni-collapse/uni-collapse.vue"
	import uniCollapseItem from "../../extra/uni-collapse-item/uni-collapse-item.vue"
	export default {
		data() {
			return {
				projectlist:[],
				queryform:{
					pageSize:20,
					current:1,
					websiteType:'9',//类型
				},
				total:0,
				type:null
			};
		},
		components:{
			// jyfParser,
			uniCollapse,
			uniCollapseItem
		},
		computed: {
		  ...mapState(['hasLogin', 'userInfo', 'userCenterData'])
		},
		onLoad(e) {
			if(e){
				this.type=e.type
			}
			this.getlist()
		},
		// 下拉
			onPullDownRefresh() {
				// 刷新位置
			this.getlist()
				var that=this
				setTimeout(function(){
						uni.stopPullDownRefresh()
					},1000)
			},
			onReachBottom(){
				if(this.queryform.pageSize*this.queryform.current>this.total){
					uni.showToast({
						title:"数据加载完毕",
						icon:'none'
					})
				}else{
					this.queryform.current++
					this.$request({
						url:'v3/website/front/seller/list',
						method:'GET',
						data:this.queryform
					}).then(res=>{
						this.projectlist.push(...res.data.list)
						
					})
				}
			},
		methods:{
			// 一键呼叫
			clallphone(val){
				uni.makePhoneCall({
					phoneNumber: this.projectlist[val].websiteSellerImageType //仅为示例
				});
			},
			
 
			
			
			getlist(){
				if(this.type==1){
					console.log(this.type);
					this.queryform.vendorId=this.userCenterData.vendorId
				   this.$request({
				   	url:'v3/website/front/seller/list',
				   	method:'GET',
				   	data:this.queryform
				   	 
				   }).then(res=>{
				   	if(res.state==200){
				   		this.projectlist=res.data.list
				   		this.total=res.data.pagination.total
				   	}
				   })
				}else{
					if(uni.getStorageSync('storeId')){
						this.queryform.vendorId=uni.getStorageSync('storeId')
						this.$request({
							url:'v3/website/front/seller/list',
							method:'GET',
							data:this.queryform
							 
						}).then(res=>{
							if(res.state==200){
								this.projectlist=res.data.list
								this.total=res.data.pagination.total
							}
						})
					}else{
						this.queryform.vendorId='640003'
						this.$request({
							url:'v3/website/front/seller/list',
							method:'GET',
							data:this.queryform
						}).then(res=>{
							if(res.state==200){
								this.projectlist=res.data.list
							   this.total=res.data.pagination.total
							}
						})
					}
				}
				
				
			},
			// 详情
		toinfo(val){
			uni.navigateTo({
				url:'/webcont/projectinfo/projectinfo?id='+val.wsellerId
			})
		}
		}
	}
</script>

<style lang="scss" scoped>
page{
			width: 750rpx;
			margin: 0 auto;
			background: #f5f5f5;
			
		}
		.warp{
			 
			 .list{
				 margin-top: 10rpx;
				 .item{
					 padding: 20rpx;
					 background-color: #fff;
					 .or_cont{
					 			 display: flex;
					 			 // justify-content: space-between;
					 			 align-items: center;
					 			 .indsuce{
					 				 margin-left: 50rpx;
					 				 font-size: 32rpx;
					 				 .phone,.duty,.name{
					 				 						 text-align: left;
					 				 						 font-size: 32rpx;
					 				 						 margin-bottom: 20rpx;
					 				 }
					 			 }
					 }
				 }
			 }
		 
		}
</style>
